import React from 'react';
import {Link} from 'react-router';
import {observer, useStaticRendering} from 'mobx-react';
import Store from './store';
import DevTools from 'mobx-react-devtools';
import {Spin} from 'antd';

import './index.less';
//component
import MenuCustom from 'components/services/MenuCustom';
import SortDialog from 'components/services/SortDialog';
import ConfirmDialog from 'components/services/ConfirmDialog';
import Message from 'components/services/Message';
import UsersEdit from 'components/services/UsersEdit';
import BannerEdit from 'components/services/BannerEdit';
import ArtworkEditor from 'components/services/ArtworkEditor';

@observer
export default class view extends React.Component {
    static propTypes = {
        //name: React.PropTypes.string,
    };
    static defaultProps = {};


    name = 'Frame';
    store = null;

    constructor(props, context) {

        super(props, context);
        this.name = props.name ? props.name : this.name;
        this.store = new Store({name: this.name});

    }

    componentWillMount() {
        this.store.will();
    }

    componentDidMount() {
        this.store.mount();
    }

    componentWillUnmount() {
        this.store.remove();
    }

    render() {
        return (
            <div>
                <SortDialog/>
                <ConfirmDialog/>
                <Message/>
                <UsersEdit/>
                <BannerEdit/>
                <ArtworkEditor/>
                <div className="orin-p-frame-root page-view">
                    <div className="left-status-bar">
                        {/*这里写一个组件去引入  ，判断的那些都在组件里面做。*/}
                        <MenuCustom/>
                    </div>
                    <div className="right-content">
                        <div className="right-scroll-content">
                            {/*内容区*/}
                            {
                                this.store.canLoadChildren &&
                                <div className="right-min-width-content">
                                    {this.props.children}
                                </div>
                            }
                        </div>
                    </div>

                    {
                        this.store.loading &&
                        <div className="loading">
                            <Spin spinning={true} size="large" tip={$$.LN.IS_LOADING}/>
                        </div>
                    }
                </div>
            </div>

        );
    }
}